.green{
    background-color: #8bc01f;
   
    .Gleft{
       
      margin-top: 67px;margin-bottom: 94px;
         color: #ffffff;
        p:first-of-type{
            margin-bottom: 23px;
            font-size: 36px;
            color: #ffffff;
           span{
                margin-right: 8px;
                display: inline-block;
                width: 55px;height: 53px; 
                background:#ffffff ;  border-radius: 2px;   
                color:#8bc01f;   
                font-size: 40px;  
                font-weight: bold;  
                 line-height: 53px;text-align: center;
                
            }
        }
        p:first-of-type~p{
            padding-left: 8px;
        }
        p:nth-of-type(2){
            margin-bottom: 66px;
            font-size: 24px;
        }
         p:nth-of-type(3),p:nth-of-type(3)~p{
             margin-bottom: 32px;
             line-height: 31px;
            font-size: 14px;
        }
        button{
             margin-left: 8px;
            margin-top: 5px;
            appearance: none;
            -webkit-appearance: none;
            border-radius: 5px;
            width: 100px;text-align: center;
            height: 34px;line-height: 34px;font-size: 13px;color: #8bc01f;
        }
    }
    .Gright{
       margin-top: 70px;
    }
    
}

.blue{
    background-color: #3393df;
   
        .LP{ margin-bottom: 20px;
            margin-top: 74px;
            font-size: 36px;
            color: #ffffff;
            span{
                margin-right: 8px;
                display: inline-block;
                width: 55px;height: 53px; 
                background:#ffffff ;  border-radius: 2px;   color:#3393df;   font-size: 40px;  font-weight: bold;  line-height: 53px;text-align: center;
                 }
        }
    .Bmiddle{
        h1{
            font-weight: normal;line-height: 42px;
            font-size: 24px;color: #ffffff;
        }
        h2{
            font-size: 14px;color: #ffffff;font-weight: normal;
            line-height: 31px;
        }
        h3{
            margin-top: 33px;
            font-weight: normal;line-height: 42px;
            font-size: 24px;color: #ffffff;
        }
        h4{
            font-size: 14px;color: #ffffff;font-weight: normal;
            line-height: 31px;
        }
    }  
    .Bright{
        margin-bottom: 62px;
        img{
            margin-top: 180px;
        }
    }  
}

.introduce{
    background-color: #ffffff;
    .textbox{padding-left: 5vw;
         p:first-of-type{
             margin-top: 91px;
            margin-bottom: 25px;
            font-size: 32px;
            color:#3393df ;
           span{
                margin-right: 8px;
                display: inline-block;
                width: 40px;height: 41px; 
                background:#3393df ;  border-radius: 2px;   
                color:#ffffff;   
                font-size: 30px;  
                font-weight: bold;  
                 line-height: 41px;text-align: center;
                
            }
         }   
            p:nth-of-type(2){
                
                font-size: 18px;color:#5d5d5d;
            }
             p:nth-of-type(3){
                 margin-top: 41px;
                font-size: 18px;color:#3393df;
            }
             p:nth-of-type(4){min-height: 42px;height:42px;
                 margin-top: 20px;line-height: 24px;text-indent:2em;
                font-size: 14px;color:#5d5d5d;
            }
             p:nth-of-type(5){  margin-top: 37px;
                font-size: 18px;color:#3393df;
            }
             p:nth-of-type(6){line-height: 24px;text-indent:2em;
                font-size: 14px;color:#5d5d5d;margin-top: 20px;min-height: 42px;height:42px;
            }
             p:nth-of-type(7){
                font-size: 18px;color:#3393df;  margin-top: 37px;
            }
             p:nth-of-type(8){line-height: 24px;text-indent:2em;
                font-size: 14px;color:#5d5d5d;margin-top: 20px;margin-bottom: 40px;min-height: 42px;height:42px;
            }
            img{
                display: block;margin: 0 auto;
                margin-bottom: 84px;margin-top: 65px;
            }
    }
}

.introduce2{
    background-color: #f7f7f7;
}

@media (max-width:991.5px){
    .green{
        .Gleft{
            margin-bottom: 0px;
        }
        .Gright{
        margin-top:65px;
        margin-bottom:90px;
                    img{
                        display: block;
                        margin: 0 auto;
                    }
         }
    }
    .blue{
        .Bleft{img{
            display: block;margin: 0 auto;
        }}
        .Bmiddle{
            padding-left: 30px;
        }
        .Bright{margin-top: 30px;
        img{
            display: block;margin: 0 auto;
        }}
    }
    
    .introduce{
        .textbox{
            P{
                text-align: center;
            }
        }
    }
       
}
@media (max-width:520px){
    .green{
        .Gleft{
          button{
              margin-top: 40px;
          }
        }
        .Gright{
                    img{
                        display: none;
                        margin: 0 auto;
                    }
         }
    }
}


@media (max-width:415px){
    .blue{
        .Bleft{img{
            width: 80%;
            display: block;margin: 0 auto;
        }}
        .Bmiddle{
            padding-left: 30px;
        }
        .Bright{margin-top: 30px;
        img{width: 68%;
            display: block;margin: 0 auto;
        }}
    }
   
    .introduce{
        .textbox{
            img{
                width:34%;
            }
        }
    } 
    
    
}
